<template>
<div class="system-dic">
    <query-box :queryForm="queryForm" @search="handleSearch(true)" @reset="handleReset"></query-box>
    <table-list :tableData="tableData" @flash="handleSearch" @add="handleAdd" @export="handleExport"></table-list>
    <add-dialog v-if="addForm.show" :addForm="addForm" @save="handleSave"></add-dialog>
</div>
</template>

<script>
import AddDialog from './AddDialog'
import TableList from './TableList'
import QueryBox from './QueryBox'
export default {
    name: 'SysDic',
    components: {
        AddDialog,
        QueryBox,
        TableList
    },
    data () {
        return {
            tableData: {
                isSearch: false,
                total: 0,
                pageSize: 10,
                currentPage: 1,
                loading: false,
                rows: []
            },
            addForm: {
                show: false,
                title: '新增',
                form: {
                    keyy: null,
                    valuee: null,
                    tableName: null,
                    fieldName: null
                }
            },
            queryForm: {
                keyy: null,
                valuee: null,
                tableName: null,
                fieldName: null
            }
        }
    },
    created () {
        this.init()
    },
    methods: {
        handleExport () {
            this.$download('/dict/excel', this.queryForm).then(res => {
                if (res) {
                    this.$message.success('导出成功')
                }
            })
        },
        handleSave () {
            let flag = this.addForm.title === '新增字典'
            this[flag ? '$formDataType2' : '$put']('/dict', this.addForm.form).then(res => {
                if (res) {
                    this.$message.success(flag ? '新增成功' : '修改成功')
                    this.addForm.show = false
                    this.init()
                }
            })
        },
        handleSearch (flag) {
            if (flag) {
                this.tableData.currentPage = 1
            }
            this.tableData.isSearch = true
            this.init()
        },
        init () {
            this.tableData.loading = true
            let params = {
                pageNum: this.tableData.currentPage,
                pageSize: this.tableData.pageSize,
                ...this.queryForm
            }
            this.$get('/dict', params).then((res) => {
                if (res) {
                    this.tableData.total = res.total
                    this.tableData.rows = res.rows
                }
            }).finally(() => {
                this.tableData.loading = false
            })
        },
        handleAdd (item) {
            if (!item) {
                this.addForm = {
                    show: true,
                    title: '新增字典',
                    form: {
                        keyy: null,
                        valuee: null,
                        tableName: null,
                        fieldName: null
                    }
                }
            } else {
                this.addForm = {
                    show: true,
                    title: '修改字典',
                    form: {
                        keyy: item.keyy,
                        valuee: item.valuee,
                        tableName: item.tableName,
                        fieldName: item.fieldName,
                        dictId: item.dictId
                    }
                }
            }
        },
        handleReset () {
            this.queryForm = {
                keyy: null,
                valuee: null,
                tableName: null,
                fieldName: null
            }
            this.tableData.currentPage = 1
            this.init()
        }
    }
}
</script>
